<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<title>thumb</title>

<link rel="stylesheet" href="../styles/uigg.css">

<script src="../js/jquery.min.js"></script>
<script src="../js/uigg.js"></script>
</head>

<body>

<style>
    div {text-align: center;position: fixed;width: 100%;background: var(--sapphire);}
    div a {line-height: 50px;padding: 0 20px;text-transform: capitalize;color: white;}
    section {height: 100vh;}
</style>

<!----------------------------------------------------------------------------------------->
<div>
    <a class="smooth" href="#one">one</a>
    <a class="smooth" href="#two">two</a>
    <a class="smooth" href="#three">three</a>
    <a class="smooth" href="#four">four</a>
</div>
<section id="one" class="center"><h2>one</h2></section>
<section id="two" class="center"><h2>two</h2></section>
<section id="three" class="center"><h2>three</h2></section>
<section id="four" class="center"><h2>four</h2></section>

<!----------------------------------------------------------------------------------------->

</body>
</html>